<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>jQuery WeUI</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" href="../css/weui.min.css">
    <link rel="stylesheet" href="../css/danceWeui.css">
	<link rel="stylesheet" href="css/demos.css">


	<style>
	  .swiper-container {
		width: 100%;
	  } 

	  .swiper-container img {
		display: block;
		width: 100%;
	  }
	</style>
</head>
<body ontouchstart>
<div class="daui-navbar bg-gradual-blue">
	<div class="daui-navbar__hd">
		<a href="javascript:history.back(-1)"><i class="iconfontzz icon-fanhuijiantou"></i>返回</a>
	</div>
	<div class="daui-navbar__bd">表单</div>
	<div class="daui-navbar__hd">
		<a href="../index.html"><i class="iconfontzz icon-home"></i></a>
	</div>
</div>

	<header class='demos-header'>
	  <h1 class="demos-title">Slider</h1>
	</header>
	<div class='demos-content-padded'>
	  <div class="weui-slider" id='slider1'>
		<div class="weui-slider__inner">
		  <div style="width: 0;" class="weui-slider__track"></div>
		  <div style="left: 0;" class="weui-slider__handler"></div>
		</div>
	  </div>
	  <br>
	  <div class="weui-slider-box" id='slider2'>
		<div class="weui-slider">
		  <div id="sliderInner" class="weui-slider__inner">
			<div id="sliderTrack" style="width: 75%;" class="weui-slider__track"></div>
			<div id="sliderHandler" style="left: 75%;" class="weui-slider__handler"></div>
		  </div>
		</div>
		<div id="sliderValue" class="weui-slider-box__value">75</div>
	  </div>
	</div>

	<script src="../lib/jquery-2.1.4.js"></script>
<script src="../lib/fastclick.js"></script>
<script>
  $(function() {
	FastClick.attach(document.body);
  });
</script>
<script src="../js/jquery-weui.js"></script>

	<script>
	  $('#slider1').slider();
	  $('#slider2').slider(function (per) {
		console.log(per);
	  });
	</script>
  </body>
</html>
